<template>
  <div class="row justify-content-center">
    <notifications></notifications>
    <div class="col-lg-5 col-md-7">
      <div class="card bg-secondary shadow border-0">
        <div class="card-header bg-transparent pb-5">
          <div class="text-muted text-center mt-2 mb-3">
            <small>正在登录 朗读能手 后台数据系统</small>
          </div>
        </div>

        <div class="card-body px-lg-5 py-lg-5">
          <form role="form">
            <base-input
              class="input-group-alternative mb-3"
              placeholder="User Name"
              addon-left-icon="ni ni-circle-08"
              v-model="model.username"
            ></base-input>

            <base-input
              class="input-group-alternative"
              placeholder="Password"
              type="password"
              addon-left-icon="ni ni-lock-circle-open"
              v-model="model.password"
            ></base-input>
            <div class="text-center">
              <base-button type="primary" class="my-4" @click="login()">登 入</base-button>
            </div>
          </form>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
import { mapActions } from "vuex";
import validate from "~/config/utils/validate";
import {adminLogin} from "~/config/api/basicuserservice";
const Cookie = process.client ? require("js-cookie") : undefined;

export default {
  head: {
    title: "朗读能手后台数据中心登入"
  },
  name: "login",
  data() {
    return {
      model: {
        username: "",
        password: ""
      }
    };
  },
  computed:{
    ...mapActions(["auth"])
  },
  methods: {
    async login() {
      let vm = this;
      if (!validate.required(this.model.username)) {
        this.$notify({
          type: "warning",
          verticalAlign: "top",
          horizontalAlign: "center",
          message: "请输入登录名"
        });
        return false;
      }
      if (!validate.required(this.model.password)) {
        this.$notify({
          type: "warning",
          verticalAlign: "top",
          horizontalAlign: "center",
          message: "请输入密码"
        });
        return false;
      }
      await adminLogin(this.model).then(res => {
        if (res.sucflag) {
          vm.$store.commit("setAuth",res.token);
          Cookie.set("auth", res.token);
          vm.$store.commit("setBasicUserInfo",res.basicuserinfo);
          vm.$router.push("/dashboard");
        }else{
          this.$notify({
          type: "warning",
          verticalAlign: "top",
          horizontalAlign: "center",
          message: "用户名或者密码错误！"
        });
        return false;
        }
      });
    }
  },
  layout: "AuthLayout"
};
</script>
<style>
</style>
